{extend name="common/base" /}

{block name="style"}
<style type="text/css">
    body{
        background:#F5F5F5;
        touch-action: none;
    }

</style>
{/block}
{block name="body"}
<div class="yhq-mains">
    <div id="pullrefresh" {neq name="user_box_id" value="0"}style="margin-top:0.6rem;"{/neq} class="mui-scroll-wrapper">
        <div class="mui-scroll">
            <ul class="yhq-nav">
                <a href="{:url('coupon')}"><li {eq name="status" value="0"} class="active"{/eq}>
                        <span class="span1">未使用</span>
                    </li>
                </a>
                <a href="{:url('coupon',['s'=>1])}">
                    <li {eq name="status" value="1"} class="active"{/eq}>
                        <span class="span1">已使用</span>
                    </li>
                </a>
                <a href="{:url('coupon',['s'=>10])}">
                    <li {eq name="status" value="10"} class="active"{/eq}>
                        <span class="span1">已过期</span>
                    </li>  
                </a>
            </ul>
            <!-- 未使用 -->

            <ul class="yhq-list {neq name="status" value="0"}yhq-list2{/neq}">
                {foreach $list as $vo }
                <li>
                              <div class="llist-left">
                                  <p class="p1">¥{$vo['par_value']}</p>
                                  <p class="p2">订单满{$vo['use_condition']}可用</p>
                              </div>
                              <div class="list-right">
                                  <p class="rig-p">{$vo.name}</p>
                                  {switch name="$vo.status"}
                                  {case value="0"}
                                  <div class="rig-div">
                                      <div class="rig-ps">过期时间:{$vo.expiry_end}</div>
                                      <a href="{:url('Index/index')}"><div class="rig-an">使用</div></a>
                                  </div>
                                  {/case}
                                  {case value="1"}
                                  <div class="rig-div">
                                      <div class="rig-ps">使用时间:{$vo.usetime}</div>
                                      <div class="rig-an2">已使用</div>
                                  </div>
                                  {/case}
                                  {case value="10"}
                                  <div class="rig-div">
                                      <div class="rig-ps">过期时间:{$vo.expiry_end}</div>
                                      <div class="rig-an2">已过期</div>
                                  </div>
                                  {/case}
                                  {/switch}
                              </div>
                          </li>
                          {/foreach}
                      </ul>
            </div>
        </div>
        <input type='hidden' value="{$status}" class='js-status'>
    </div>
    {/block}
    {block name="script"}
    <script>
        mui('body').on('tap', 'a', function () {
            window.top.location.href = this.href;
        });
        var p = 1;
        var status = $('.js-status').val();
        var loading = false;  //状态标记
        mui.init({
            pullRefresh: {
                container: '#pullrefresh',
                up: {
                    height: 50, //可选.默认50.触发上拉加载拖动距离
                    contentrefresh: '正在加载...',
                    contentnomore: '没有更多了', //可选，请求完毕若没有更多数据时显示的提醒内容；
                    callback: pullupRefresh
                }
            }
        });

        /**
         * 上拉加载具体业务实现
         */
        function pullupRefresh() {
            $.post("{:url('couponItem')}", {p: p, s: status}, function (res) {
                if (res) {
                    $(".yhq-list").append(res);
                    p++;
                    mui('#pullrefresh').pullRefresh().endPullupToRefresh(false); //参数为true代表没有更多数据了。
                } else {
                    mui('#pullrefresh').pullRefresh().endPullupToRefresh(true); //参数为true代表没有更多数据了。
                }
            }, 'json');

        }
    </script>
    {/block}